<template>
    <TreeSelect ret-attr="key" :multiple="multiple" v-model="selectVal" :treeData="OrgStruct" :placeholder='placeholder' strategy="SHOW_ALL" @on-select-change="onSelectChange"></TreeSelect>
</template>

<script>
    import AppFrame from '../libs/app-frame';
    import TreeSelect from '../components/tree-select';
    export default {
        name: 'org-select',
        props: ['partnersId','value','multiple','placeholder'],
        model: {
            prop: 'value',
            event: 'updateVal'
        },
        components:{
            TreeSelect
        },
        data: function() {
            return {
                selectVal:this.value,
                OrgStruct:[]
            }
        },
        created () {

            this.getData(this.partnersId);
        },

        watch: {
            partnersId:async function(curVal,oldVal){
                if(curVal!=oldVal){
                    await this.getData(curVal);
                }
            },
            selectVal:function(curVal,oldVal){
                this.setValue(curVal);
            },
            value:function(curVal){
                this.selectVal=curVal;

            },
        },
        methods: {
            init:function(){
                if(this.placeholder || this.placeholder==='') this.placeholder="请选择";
            },
            getData:async function(partnersId){

                let ret = await AppFrame.Http.Post("/manage-api/system/org-struct/getPartnersTreeData",{partnersId:partnersId});
                if(ret && ret.Result==1){
                    this.OrgStruct=ret.Data;
                    console.log(this.OrgStruct)
                }
                // this.OrgStruct.splice(0,0,{
                //     key:0,
                //     value:0,
                //     title:'本系统'
                // });
            },
            setValue: function(val) {
                this.$emit("updateVal", val);
            },

            onSelectChange:function(item){

                this.$emit('on-select-change',item);
            }
        }
    }
</script>

<style scoped>

</style>
